// Copyright 2019 The rhyme_lph Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
// e [author] rhyme_lph
// K [email]  rhymelph@gmail.com
// E [github] https://github.com/rhymelph

import 'package:base_plugin/base_plugin.dart';
import 'package:finance_app/generated/l10n.dart';
import 'package:finance_app/src/common/app_colors.dart';
import 'package:finance_app/src/common/app_spaces.dart';
import 'package:finance_app/src/widgets/button/normal_button.dart';
import 'package:finance_app/src/widgets/common_app_bar.dart';
import 'package:finance_app/src/widgets/input/input_field.dart';
import 'package:finance_app/src/widgets/input/input_min_field.dart';
import 'package:flutter/material.dart';
import 'package:finance_app/src/provider/setting/subscription/sub_add_credit_card_provider.dart';
import 'package:finance_app/src/router_gen/router_meta.dart';
import 'package:flutter_svg/svg.dart';
import 'package:finance_app/generated/a.dart';

@RouterMeta(paramName: "subAddCreditCardPage")
class SubAddCreditCardPage extends StatefulWidget {
  @override
  _SubAddCreditCardPageState createState() => _SubAddCreditCardPageState();
}

class _SubAddCreditCardPageState extends State<SubAddCreditCardPage>
    with PagePresenter<SubAddCreditCardPage, SubAddCreditCardProvider> {
  @override
  PreferredSizeWidget get appBar =>
      getDefaultAppBar(title: S.current.add_credit_card);

  @override
  Widget get buildWidget => ListView(
        padding: EdgeInsets.only(top: getDp(20)),
        children: [
          InputField(
            margin: EdgeInsets.symmetric(horizontal: getDp(25)),
            controller: provider.cardholderNameController,
            focusNode: provider.cardholderNameFocusNode,
            tip: S.current.cardholder_name,
            trailing: PressedOpacityButton(
              onPressed: provider.onCameraCardName,
              padding: EdgeInsets.only(right: getDp(10)),
              child: SvgPicture.asset(
                A.assetsImagesStylePhoto_camera_interface_symbol_for_button_2,
                width: getDp(24),
                height: getDp(24),
                fit: BoxFit.contain,
                color: aceBlueColor,
              ),
            ),
          ),
          AppSpaces.h30,
          InputField(
            margin: EdgeInsets.symmetric(horizontal: getDp(25)),
            controller: provider.cardNumberController,
            focusNode: provider.cardNumberFocusNode,
            tip: S.current.card_number,
          ),
          AppSpaces.h30,
          Padding(
            padding: EdgeInsets.only(left: getDp(25)),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.start,
              children: [
                InputMinField(
                  controller: provider.mmController,
                  focusNode: provider.mmFocusNode,
                  tip: 'MM',
                ),
                AppSpaces.w15,
                InputMinField(
                  controller: provider.yyController,
                  focusNode: provider.yyFocusNode,
                  tip: 'YY',
                ),
                AppSpaces.w15,
                InputMinField(
                  controller: provider.cvvController,
                  focusNode: provider.cvvFocusNode,
                  tip: 'CVV',
                  width: getDp(95),
                ),
              ],
            ),
          ),
          AppSpaces.h30,
          NormalButton(
            title: S.current.add,
            onTap: provider.onAdd,
          )
        ],
      );
}
